<!doctype html>

<html lang="en">
	<head>
		<title>A simple way to rent movies - CookieFlix</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" href="css/base.css">
		<link rel="shortcut icon" href="img/favicon.ico">
		
		<!-- jQuery -->
		<script src="js/jquery.js"></script>
		
		<!-- user class -->
		<script src="js/user.js"></script>
		
		<!-- initialization script -->
		<script src="js/init.js"></script>

	</head>
	<body>
		<div id="container">
			<!-- header contains profile button, blog link, and search box -->
			<header>
				<nav>
					<a href="index.html"><img src="img/cf_logo_small.png" alt="Profile"></a>
					<a class="text" href="blog.html">PFG Blog</a>
					
					<!-- search box -->
					<form name='search' action='search.html' method='get'> 
						<input type="text" name="q" placeholder="Find a movie" tabindex="1">
					</form>
				</nav>
			</header>

			<div id="profile">
				<!-- This section is filled by HtmlFactory using "user" data -->
				
				<h1>Recommendations</h1>
				<div id="results">
				
				</div>
				<a href="history.html"><h1>View Rental History</h1></a>
			</div>

		</div>
		
		<!-- app scripts -->
		<script src="js/search.js"></script>
		<script src="js/movie_info.js"></script>
		<script src="js/movie_element.js"></script>
		<script src="js/html_factory.js"></script>
		<script src="js/tmdb_connection.js"></script>
		
		<!-- recommendation script -->
		<script>
		var u = User.read();
		
		if(u.rentals.length == 0) {
			$("#results").html("<p>Rent or rate movies to see recommendations</p>");
		} else {
			u.recommendations();
		}
		</script>
	</body>
</html>